﻿@{
    ViewBag.Title = "上传";
}

<link href="~/Assets/css/dropzone.css" rel="stylesheet" />
<link rel="stylesheet" href="assets/css/ace.min.css" />
<div class="row">
    <div class="col-xs-12">
        <!-- PAGE CONTENT BEGINS -->
        <div id="dropzone">
            <form action="/UserDataAPI/UploadFile?path=@Request["path"]" class="dropzone dz-clickable">
                <div class="dz-default dz-message"><span><span class="bigger-150 bolder"><i class="icon-caret-right red"></i> 拖放文件</span> 到此处上传 				<span class="smaller-80 grey">(或单击)</span> <br> 				<i class="upload-icon icon-cloud-upload blue icon-3x"></i></span></div>
            </form>
        </div><!-- PAGE CONTENT ENDS -->
    </div><!-- /.col -->
</div>
<script src="~/Assets/js/dropzone.min.js"></script>
<script type="text/javascript">
			jQuery(function($){

			try {
			  $(".dropzone").dropzone({
			    paramName: "file", // The name that will be used to transfer the file
			    maxFilesize: 0.5, // MB

				addRemoveLinks : true,
				dictDefaultMessage :
				'<span class="bigger-150 bolder"><i class="icon-caret-right red"></i>拖放文件</span>到此处上传 \
				<span class="smaller-80 grey">(或者单击)</span> <br /> \
				<i class="upload-icon icon-cloud-upload blue icon-3x"></i>'
			,
				dictResponseError: '上传文件出错！',

				//change the previewTemplate to use Bootstrap progress bars
				previewTemplate: "<div class=\"dz-preview dz-file-preview\">\n  <div class=\"dz-details\">\n    <div class=\"dz-filename\"><span data-dz-name></span></div>\n    <div class=\"dz-size\" data-dz-size></div>\n    <img data-dz-thumbnail />\n  </div>\n  <div class=\"progress progress-small progress-striped active\"><div class=\"progress-bar progress-bar-success\" data-dz-uploadprogress></div></div>\n  <div class=\"dz-success-mark\"><span></span></div>\n  <div class=\"dz-error-mark\"><span></span></div>\n  <div class=\"dz-error-message\"><span data-dz-errormessage></span></div>\n</div>"
			  });
			} catch(e) {
			  alert('Dropzone.js 不支持您的浏览器！');
			}

			});
</script>
